<template>
  <el-card shadow="never" class="h-full" :body-style="{ height: '100%' }">
    <template #header>
      <slot name="header"></slot>
    </template>
    <el-row :gutter="10">
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb-10px">
        <el-text>综合消费: <el-tag>总部排行</el-tag> <el-tag>门店排行</el-tag></el-text>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb-10px">
        <el-text>普通消费: <el-tag>总部排行</el-tag> <el-tag>门店排行</el-tag></el-text>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb-10px">
        <el-text>卡类消费: <el-tag>总部排行</el-tag> <el-tag>门店排行</el-tag></el-text>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb-10px">
        <el-text>会员充值: <el-tag>总部排行</el-tag> <el-tag>门店排行</el-tag></el-text>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb-10px">
        <el-text>服务次数: <el-tag>总部排行</el-tag> <el-tag>门店排行</el-tag></el-text>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb-10px">
        <el-text>消耗业绩: <el-tag>总部排行</el-tag> <el-tag>门店排行</el-tag></el-text>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb-10px">
        <el-text>负债金额: <el-tag>总部排行</el-tag> <el-tag>门店排行</el-tag></el-text>
      </el-col>
      <el-col :xs="24" :sm="24" :md="24" :lg="24" :xl="24" class="mb-10px">
        <el-text>可用积分: <el-tag>总部排行</el-tag> <el-tag>门店排行</el-tag></el-text>
      </el-col>
    </el-row>
  </el-card>
</template>
<script setup lang="ts">
import { formatDate } from '@/utils/formatTime'
import { fenToYuan } from '@/utils'

import * as UserApi from '@/api/member/user'

const { user } = defineProps<{ user: UserApi.UserVO }>()
</script>
<style scoped lang="scss">
.card-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
}
</style>
